import { eventTypes, dataTypes } from '../../../../constants/events';
import {WeaLocaleProvider} from "ecCom";
const getLabel = WeaLocaleProvider.getLabel;
const { 
  DOMLOAD, 
  FIELDVALUECHANGE,
  SETFIELDVALUE,
  GETFIELDVALUE,
  GETURLPARAMVALUE,
  ONSUBMIT,
  ONBEFORESUBMIT,
  AJAX,
  MESSAGE,
  ALERT,
  CONFIRM,
} = eventTypes;

const { STRING, FUNCTION, OBJECT } = dataTypes;

const N = '\n';

const noteContentTmp = (val) => {
  const { tips, funcLabel, param, returnValue } = val;

  const noteParam = param.reduce((prev, cur) => {
    cur = `<div class="ace-note-param">
            <div class="param-name">
              <span><strong>${cur.name}</strong></span>
              <span>${cur.type}</span><span>${cur.isNeed ? ('[ '+ getLabel('383237','必需') +' ]') : ('[ ' + getLabel('383238','可选') + ' ]')}</span>
            </div>
            <div class="param-text">${cur.text}</div>
          </div>`;

    return prev + cur;
  }, '');
  
  return (
    `<div class="ace-note-main">
    <div class="ace-note- p">${tips}</div>
    <div class="ace-note-p">
      ${funcLabel}
    </div>
    <div class="ace-note-p" style="margin-bottom: 3px;">
      <strong>${getLabel('561','参数') }：</strong>
    </div>
    ` + noteParam + `
    <div class="ace-note-p"><strong>${getLabel('27907','返回值') }：</strong>${returnValue ? returnValue : getLabel('83519','无') }</div>
    </div>`
  )
}

const datas = () => {
  return {
    SETFIELDVALUE: {
      tips: getLabel('526743','使用此方法设置表单字段的值'),
      funcLabel: 'EdcForm.setFieldValue(fieldid, value);',
      param: [
        {
          name: 'fieldid',
          type: STRING,
          isNeed: true,
          text: getLabel('82435','字段id') ,
        },
        {
          name: 'value',
          type: STRING,
          isNeed: true,
          text: getLabel('22217','字段值'),
        }
      ],
    },
    GETFIELDVALUE: {
      tips: getLabel('526744','使用此方法获取表单字段的值') ,
      funcLabel: 'EdcForm.getFieldValue(fieldid);',
      param: [
        {
          name: 'fieldid',
          type: STRING,
          isNeed: true,
          text: getLabel('82435','字段id') ,
        },
      ],
      returnValue: getLabel('22217','字段值')
    },
    GETURLPARAMVALUE: {
      tips: getLabel('527861','使用此方法获取url中的参数值') ,
      funcLabel: 'EdcForm.getUrlParamValue(key);',
      param: [
        {
          name: 'key',
          type: STRING,
          isNeed: true,
          text: getLabel('23481','参数名称'),
        },
      ],
      returnValue: getLabel('17637','参数值')
    },
    DOMLOAD: {
      tips: getLabel('527862','使用此方法在页面加载完成后执行该事件的回调') ,
      funcLabel: 'EdcForm.bindEvent("domload", handler);',
      param: [
        {
          name: 'handler',
          type: FUNCTION,
          isNeed: true,
          text: getLabel('527863','回调方法') ,
        },
      ],
    },
    FIELDVALUECHANGE: {
      tips: getLabel('527865','使用此方法改变表单属性的值') ,
      funcLabel: 'EdcForm.bindEvent("filedvaluechange", fieldid, handler);',
      param: [
        {
          name: 'fieldids',
          type: STRING,
          isNeed: true,
          text: getLabel('527866','要监听的元素id'),
        },
        {
          name: 'handler',
          type: FUNCTION,
          isNeed: true,
          text: getLabel('527863','回调方法'),
        },
      ],
    },
    ONSUBMIT: {
      tips: getLabel('527867','使用此方法在表单提交后执行该事件的回调'),
      funcLabel: 'EdcForm.bindEvent("onSubmit", handler);',
      param: [
        {
          name: 'handler',
          type: FUNCTION,
          isNeed: true,
          text: getLabel('527863','回调方法'),
        },
      ],
    },
    ONBEFORESUBMIT: {
      tips: getLabel('527868','使用此方法可在表单提交前进行相关操作') ,
      funcLabel: 'EdcForm.bindEvent("onBeforeSubmit", handler);',
      param: [
        {
          name: 'handler',
          type: FUNCTION,
          isNeed: true,
          text: getLabel('527863','回调方法'),
        },
      ],
    },
    AJAX: {
      tips: getLabel('527869','调用此方法可以发送ajax请求'),
      funcLabel: 'EdcForm.ajax(url, options);',
      param: [
        {
          name: 'url',
          type: STRING,
          isNeed: true,
          text: getLabel('130838','接口地址'),
        },
        {
          name: 'options',
          type: OBJECT,
          isNeed: false,
          text: `<div>${getLabel('128540','请求参数')}</div>
               <div class="param-text"> { </div>
               <div class="param-text"> &nbsp;&nbsp;  type ：${getLabel('15522','请求类型') } </div>
               <div class="param-text"> &nbsp;&nbsp;  data ： ${getLabel('527870','规定要发送到服务器的数据') } </div>
               <div class="param-text"> &nbsp;&nbsp;  dataType ：${getLabel('527871','预期的服务器响应的数据类型') } </div>
               <div class="param-text"> &nbsp;&nbsp;  success ：${getLabel('527872','请求成功后的回调')}</div>
               <div class="param-text"> &nbsp;&nbsp;  error ：${getLabel('527873','请求失败后的回调') }</div>
               <div class="param-text"> } </div>`,
        },
      ],
      returnValue: getLabel('527874','Promise对象')
    },
    ALERT: {
      tips: getLabel('526754','使用此方法可以打开一个系统提示框') ,
      funcLabel: 'EdcForm.alert("'+ getLabel('127354','警告') +'");',
      param: [
        {
          name: 'msg',
          type: STRING,
          isNeed: true,
          text: getLabel('527875','提示消息') ,
        },
      ],
    },
    MESSAGE: {
      tips: getLabel('526753','使用此方法可以弹出一个消息提示') ,
      funcLabel: `<div>EdcForm.message("info", "${getLabel('558','提示')}");</div>
                <div>EdcForm.message("success", "${getLabel('15242','成功') }");</div>
                <div>EdcForm.message("error", "${getLabel('127353','错误') }");</div>
                <div>EdcForm.message("warning", "${getLabel('127354','警告') }");</div>`,
      param: [
        {
          name: 'msgType',
          type: STRING,
          isNeed: true,
          text: getLabel('527876','提示类型, 支持四种类型')  + ': "inof", "success", "error", "warning"',
        },
        {
          name: 'msgStr',
          type: STRING,
          isNeed: true,
          text: getLabel('527875','提示消息') ,
        },
      ],
    },
    CONFIRM: {
      tips: getLabel('526755','使用此方法可以打开一个系统确认框') ,
      funcLabel: 'EdcForm.confirm("'+ getLabel('527875','提示消息')  +'", function(){}, function(){});',
      param: [
        {
          name: 'msg',
          type: STRING,
          isNeed: true,
          text: getLabel('527877','确认框文本信息'),
        },
        {
          name: 'onOk',
          type: FUNCTION,
          isNeed: false,
          text: getLabel('527878','点击确认按钮后执行的方法') ,
        },
        {
          name: 'onCancel',
          type: FUNCTION,
          isNeed: false,
          text: getLabel('527879','点击取消按钮后执行的方法') ,
        },
      ],
    }
  }
}

export const snippets = () => {

  const DATAS = datas();

  return [
    {
      example: (`/* ${getLabel('527883','根据字段id设置字段值') } */${
        N}/* ${getLabel('527884','如果是明细子表，设置值为二维数组') }[['12','123']] */${
        N}/* ${getLabel('527885','如果设置明细子表多行值，设置值为') }[['12', '123'],['12','123']]${
        N}EdcForm.setFieldValue("d3e253f9a7504d30ad153ecbaf909f64", "123");`),
      id: SETFIELDVALUE,
      template: '',
      noteTitle: getLabel('527886','设置属性值') ,
      snippet: 'EdcForm.setFieldValue("::focus", "");',
      snippetFace: SETFIELDVALUE,
      noteContent: noteContentTmp(DATAS.SETFIELDVALUE),
    },
    {
      example: (`/* ${getLabel('527887','根据字段id获取字段值')} */${
        N}EdcForm.getFieldValue("d3e253f9a7504d30ad153ecbaf909f64");`),
      id: GETFIELDVALUE,
      template: '',
      noteTitle: getLabel('527888','获取属性值') ,
      snippet: 'EdcForm.getFieldValue("::focus");',
      snippetFace: GETFIELDVALUE,
      noteContent: noteContentTmp(DATAS.GETFIELDVALUE)
    },
    {
      example: (`/* ${getLabel('527889','获取url中的参数值') } */${
        N}EdcForm.getUrlParamValue(key);`),
      id: GETURLPARAMVALUE,
      template: '',
      noteTitle: getLabel('527889','获取url中的参数值') ,
      snippet: 'EdcForm.getUrlParamValue("::focus");',
      snippetFace: GETURLPARAMVALUE,
      noteContent: noteContentTmp(DATAS.GETURLPARAMVALUE)
    },
    {
      example: (`EdcForm.ajax("url", {${
        N}  type: 'get',             //${getLabel('386823','请求方法')}${
        N}  data: {},                //${getLabel('527890','传参') }${
        N}  dataType: 'json',        //${getLabel('527891','数据返回格式') }${
        N}  success: function() {},  //${getLabel('527892','成功后的回调') }${
        N}  error: function() {},    //${getLabel('527893','失败后的回调') }${
        N}});`),
      id: AJAX,
      noteTitle: getLabel('526746','发送ajax请求') ,
      template: 'EdcForm.ajax(url, options);',
      snippet: `EdcForm.ajax('::focus', {${
        N}    type: 'get',${
        N}    data: {},${
        N}    dataType: 'json',${
        N}    success: function() {},${
        N}    error: function() {},${
        N}});`,
      snippetFace: AJAX,
      noteContent: noteContentTmp(DATAS.AJAX)
    },
    {
      id: DOMLOAD,
      template: '',
      noteTitle: getLabel('527894','绑定页面加载完成后事件') ,
      snippet: 'EdcForm.bindEvent("domLoad", function(){\n    ::focus \n});',
      snippetFace: DOMLOAD,
      example: (`EdcForm.bindEvent("domLoad", function(){${
        N}  /* ${getLabel('527895','执行页面加载完成后的回调操作') } */${
        N}  console.log("page loaded.");${
        N}});`),
      noteContent: noteContentTmp(DATAS.DOMLOAD)
    },
    {
      example: (`EdcForm.bindEvent("fieldValueChange", "d3e253f9a7504d30ad153ecbaf909f64", function(fieldId, value){${
        N}  /* ${getLabel('527896','返回值包含 fieldId 和value')} */${
        N}});`),
      id: FIELDVALUECHANGE,
      noteTitle: getLabel('527897','绑定属性值改变事件') ,
      template: 'EdcForm.bindEvent(FIELDVALUECHANGE, [""], function(){});',
      snippet: 'EdcForm.bindEvent("fieldValueChange", "", function(){\n    ::focus \n});',
      snippetFace: FIELDVALUECHANGE,
      noteContent: noteContentTmp(DATAS.FIELDVALUECHANGE)
    },
    {
      example: (`EdcForm.bindEvent("onSubmit", function(dataId){${
        N}  /*${getLabel('527898','表单提交后执行的回调操作') }*/${
        N}  console.log("${getLabel('527899','表单提交后回调') }");${
        N}});`),
      id: ONSUBMIT,
      noteTitle: getLabel('527900','绑定表单提交后事件') ,
      template: 'EdcForm.onSubmit(ONSUBMIT, function(){});',
      snippet: 'EdcForm.bindEvent("onSubmit", function(){\n    ::focus \n});',
      snippetFace: ONSUBMIT,
      noteContent: noteContentTmp(DATAS.ONSUBMIT)
    },
    {
      example: (`EdcForm.bindEvent("onBeforeSubmit", function(){${
        N}  /*${getLabel('527901','表单提交前的验证操作') }*/${
        N}  return true; // ${getLabel('527902','允许表单提交') }${
        N}  return false; // ${getLabel('527903','阻止表单提交') }${
        N}  return Promise.resolve(true); //${getLabel('527904','异步操作，允许表单提交') }${
        N}  return Promise.resolve(false); // ${getLabel('527905','异步操作，阻止表单提交') }${
        N}});`),
      id: ONBEFORESUBMIT,
      noteTitle: getLabel('526751','表单提交前验证事件') ,
      template: 'EdcForm.onBeforeSubmit();',
      snippet: 'EdcForm.bindEvent("onBeforeSubmit", function(){\n    ::focus \n});',
      snippetFace: ONBEFORESUBMIT,
      noteContent: noteContentTmp(DATAS.ONBEFORESUBMIT)
    },
    {
      example: (`/* ${getLabel('527906','操作反馈提示') } */ ${
        N}EdcForm.message("info", "${getLabel('558','提示') }");${
        N}EdcForm.message("success", "${getLabel('15242','成功') }");${
        N}EdcForm.message("error", "${getLabel('127353','错误') }");${
        N}EdcForm.message("warning", "${getLabel('127354','警告') }");`),
      id: MESSAGE,
      noteTitle: getLabel('527907','轻提示, 可提供成功、警告和错误等反馈信息'),
      template: 'EdcForm.message();',
      snippet: 'EdcForm.message("info::focus", "'+ getLabel('24960','提示信息') +'");',
      snippetFace: MESSAGE,
      noteContent: noteContentTmp(DATAS.MESSAGE)
    },
    {
      example: (`/* ${getLabel('527910','弹框提示')} */ ${N}EdcForm.alert("msg");`),
      id: ALERT,
      noteTitle: getLabel('558','提示'),
      template: 'EdcForm.alert();',
      snippet: 'EdcForm.alert("'+ getLabel('127354','警告') +'");',
      snippetFace: ALERT,
      noteContent: noteContentTmp(DATAS.ALERT)
    },
    {
      example: (`/* ${getLabel('527912','确认框') } */ ${N}EdcForm.confirm("${getLabel('527911','确认关闭弹框')}?", function() {${
        N}    /* ${getLabel('527878','点击确认按钮后执行的方法')} */  ${
        N}  }, function() {${
        N}    /* ${getLabel('527879','点击取消按钮后执行的方法')} */ ${
        N}}); ${
        N}/* ${getLabel('527913','支持按钮名称控制') } */ ${
        N}EdcForm.confirm({${
        N}  content: "${getLabel('527911','确认关闭弹框') }?", ${
        N}  okText: "${getLabel('33703','确认') }", ${
        N}  cancelText: "${getLabel('31129','取消') }", ${
        N}  onOk: function() {},     // ${getLabel('527878','点击确认按钮后执行的方法')} ${
        N}  onCancel: function() {}  // ${getLabel('527879','点击取消按钮后执行的方法')} ${
        N}});  `),
      id: CONFIRM,
      noteTitle: getLabel('527912','确认框') ,
      template: 'EdcForm.confirm();',
      snippet: 'EdcForm.confirm("'+ getLabel('527875','提示消息') +'", function(){}, function(){});',
      snippetFace: CONFIRM,
      noteContent: noteContentTmp(DATAS.CONFIRM)
    }
  ];
};